<template>
    <el-card shadow="hover" header="画板">
        <div class="excalidraw-example">
            <div class="drawing-area" style="height: 800px;">
                <Basic />
            </div>
        </div>
    </el-card>
</template>
<script lang="ts">
import {applyReactInVue, applyPureReactInVue} from 'veaury'
import { toRefs, reactive, defineComponent } from 'vue'
import { Excalidraw } from '@excalidraw/excalidraw'

export default defineComponent({
    components: {
    // 使用高阶组件 'applyReactInVue'
    Basic: applyReactInVue(Excalidraw),
    // 现在推荐使用纯净模式的 'applyPureReactInVue'
    BasicPure: applyPureReactInVue(Excalidraw)
  },
    name: 'drawInProject',
    setup() {
        const state = reactive({
        })
        return {
            ...toRefs(state),
        }
    }
})
</script>